<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
	<%@page import="java.lang.*" %>
<%
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ request.getContextPath() + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<title>Insert title here</title>
<style type="text/css">
.tag {
	font-size: 25px;
	font-weight: bold;
	border: 2px solid green;
}

.tag1 {
	font-size: medium;
	font-weight: normal;
}
.tag2{
 font-size:20px;
 color:blue;
   }
.tag3{
  font-size:medium;
  color:black;
 }
</style>


<script type="text/javascript">
	function moveOn() {
		var sty = document.getElementById("con");
		sty.className = "tag";
	}
	function moveOut() {
		var sty = document.getElementById("con");
		sty.className = "tag1";
	}
   function select(){
		 var sty=document.getElementsByTagName("td");
		 for (var num = 0; num < sty.length; num++) {
			var element=sty[num];
			 element.className="tag2";
		}
	}
	function selectCancle(){
		 var sty=document.getElementsByTagName("td");
		 for (var num = 0; num < sty.length; num++) {
		    var element=sty[num];
			element.className="tag3";
		}
		 
	}
	function textArea(){
	   var result=confirm("是否确定");
	 if(result==true){
		 alert("输入完成！");
	 }else{
		 alert("欢迎下次使用！");
	 }
	}
	/* 
	 通过函数获取当前时间，并设置函数运行时间间隔，实现计时效果  	*/
	
	
	var attime;
	function clock(){
		var time=new Date();
		 attime=time.getHours()+"时:"+time.getMinutes()+"分："+time.getSeconds()+"秒";
	document.getElementById("clock").value = attime;
	//获取即时时间信息，赋值给 “clock”,达到计数效果
	}
	  var i= setInterval("clock()",1000); //设置函数运行时间间隔
	  
	  
	  
	  //设置实现指定时间后运行函数  
	  var newTime=10;
	  function timeNew(){
		  newTime=newTime--;
	  }
	  
	  function  timeCut(){
		  var j=setInterval("timeNew", 1000);
		 document.getElementById("timeCut").value=newTime;
	  }
	</script>
</head>
<body >
  <div onmouseover="moveOn()" onmouseout="moveOut()">
	<p  id="con" >hello world!</p>
	</div>
	<br>
	<br>
    <form onmouseover="select()" onmouseout="selectCancle()">
    <table>
    <tr>
    <td>爱好：</td>
    <td><input type="checkbox" name="hobby"  value="movie" />看电影</td>
    <td><input type="checkbox" name="hobby"  value="shopping"/>购物</td>
    <td><input type="checkbox" name="hobby"  value="walking"/>散步</td>
    <td><input type="checkbox" name="hobby"  value="swimming"/>游泳</td>
    </tr>
    </table>
    </form>
    
<form>
个人简历：<br>
<textarea cols="30" rows="20"  onchange="textArea()">输入个人信息！</textarea>
</form>

<form>
<input type="text" id="clock" size="50"/>
<input type="text" id="timeCut" size="50"/><p>秒后跳转至百度</p>
</form>


















</body>
</html>